<script setup lang='ts'>
import { ref, computed } from 'vue'
import type { Ref, ComputedRef } from 'vue'
import { useRouter } from 'vue-router'
import type { Router } from 'vue-router'
import { dofinishregister } from '../../api/user'
const password: Ref<string> = ref('')
const password2: Ref<string> = ref('')

const router: Router = useRouter()

const flag: ComputedRef<boolean> = computed(() => {
  return password.value == password2.value && password.value.length != 0
})

const tel: string = sessionStorage.getItem('tel') || ''

function onSubmit() {
  // 发送请求进行注册
  dofinishregister({
    tel,
    password: password.value
  }).then(res => {
    // console.log(res.data);
    if (res.data.code == 200) {
      // 路由跳转的时候可以通过 query 自定义传递的参数
      sessionStorage.clear()

      router.push({
        path: '/login',
        query: {
          code: 10086
        }
      })
    }

  })
}

</script>
<template>


  <div class='content' style="padding-top: 30px;">
    <van-form @submit="onSubmit">
      <van-cell-group inset>
        <van-field v-model="password" name="密码" label="密码" placeholder="请输入密码"
          :rules="[{ required: true, message: '请填写密码' }]">
        </van-field>
      </van-cell-group>

      <van-cell-group inset>
        <van-field v-model="password2" name="确认密码" label="确认密码" placeholder="请再次输入确认密码"
          :rules="[{ required: true, message: '请再次填写密码' }]">
        </van-field>
      </van-cell-group>

      <div style="padding: 30px 20px 0 20px;">
        <van-button :disabled='!flag' native-type="submit" round block color='#f66'>
          提交注册
        </van-button>
      </div>

    </van-form>

  </div>

</template>
<style scoped lang="scss"></style>